<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>校服定制-提交订单</title>
    <link rel="stylesheet" href="__TMPL__Public/assets/css/Reset.css">
    <link rel="stylesheet" href="__TMPL__Public/assets/css/details.css">

    <!--Required libraries-->
    <script src="__TMPL__Public/assets/js/jquery-v1.10.2.min.js" type="text/javascript"></script>
    <script src="__TMPL__Public/assets/js/modernizr-custom-v2.7.1.min.js" type="text/javascript"></script>
    <script src="__TMPL__Public/assets/js/jquery-finger-v0.1.0.min.js" type="text/javascript"></script>
    <script src="__TMPL__Public/assets/js/jquery.cookie.js" type="text/javascript"></script>
    <style>
        /*轮播图*/
        .swiper-container {
            width: 100%;
            height: 12em;
        }
        body{
            background: #f5f5f5;
        }
        .layui-layer-content{
            text-align: center;
        }
    </style>
</head>
<body>
    <!-- 轮播 -->
    <tc_include file="Public:head"/>
    <!-- 内容 -->
    <form id="frm" action="{:U('Shop/shoppost')}" method="post">
    <div class="det-custom">
        <notempty name="shops">
        <foreach name="shops" item="vo" key="k">
            <div class="det-con">
                <div class="det-conL"><img src="{:sp_get_image_preview_url($vo['smeta']['thumb'])}" alt=""></div>
                <div class="det-conR">
                    <div class="det-title">
                        <p>{$vo.shop_title}</p>
                        <p><span>【{$vo.study_name}】</span></p>
                    </div>
                    <ul>
                        <foreach name="vo.shop_size" item="v">
                            <li class="shop_size" name="{$v}">{$v}</li>
                        </foreach>
                    </ul>
                    <div class="det-num">
                        <p class="jian"></p>
                        <p class="shuzi"><input id="num" type="text" name="goods[{$k}]['num']" value="1"></p>
                        <p class="jia"></p>
                    </div>
                    <div class="more">
                        <p class="add"></p>
                    </div>
                    <input type="hidden" name="goods[{$k}]['id']" value="{$vo.id}">
                    <input type="hidden" name="goods[{$k}]['shop_name']" value="{$vo.shop_name}">
                    <input type="hidden" name="goods[{$k}]['shop_price']" value="{$vo.shop_price}">
                    <input class="size" type="hidden" name="goods[{$k}]['shop_size']" value="">
                </div>
            </div>
        </foreach>
            <input type="hidden" name="study_id" id="study_id" value="{$Think.get.study_id}">
        <else/>
            <div style="text-align: center;background: #fff;width: 80%;font-size: 1.6em;color: #666;margin:8em auto;line-height:6em;">暂无数据 ,
                <a style="font-size: 0.8em;color:#0b6cbc;" href="javascript:history.go(-1);"> 返回上一页</a> </div>
        </notempty>
    </div>
    </form>
    <!-- 底部导航 -->
    <div class="bott-footer"></div>
    <div class="footer"><a href="javascript:;" id="subshop">提交订单</a></div>
    <div class="alert-mask" style="">
        <div class="alert-content">
            <h2>温馨提示</h2>
            <p>校服为定制商品生产周期约为60天左右，请酌情选择尺码</p>
            <div class="sure-btn"><a href="javascript:;">我知道了</a></div>
        </div>
    </div>
    <script src="__TMPL__Public/assets/layer/layer.js"></script>
    <script>
        $(function(){
            //复制元素
            $('.add').click(function(){
                var li = $(this).closest(".det-con");
                var oldHtml = li.html();
                oldHtml = oldHtml.replace(/add/,'remove');
                var count = $(".det-con").length;
                count++;
                var oldHtml =oldHtml.replace(/goods\[\d{0,}\]/g,'goods['+count+']');
                li.after('<div class="det-con">'+oldHtml+'</div>');
            });

            $('.sure-btn').click(function(){
                $('.alert-mask').hide();
                $.cookie('myzdl',1);
            });
            if($.cookie('myzdl') != null){
                $('.alert-mask').hide();
            }
            //加
            $('.jia').click(function(){
                if($('#num').val() == ''){
                    $('#num').val(1);
                }else{
                    $('#num').val(parseInt($('#num').val())+1);
                }
            });
            //减
            $('.jian').click(function(){
                if(parseInt($('#num').val()) <= 1 || $('#num').val() == ''){
                    $('#num').val(1);
                }else{
                    $('#num').val(parseInt($('#num').val())-1);
                }
            });

            //选择尺码
            $(".det-custom").on("click",".shop_size", function(){
                var name = $(this).attr('name');
                $(this).css('background','#0379d9').siblings().css('background','#fff');
                $(this).closest(".det-con").find('.size').val(name);
            });

            //提交商品
            $('#subshop').click(function () {
                var study_id = $('#study_id').val();
                $.post("{:U('Shop/shoppost')}",{study_id:study_id},function(data){
                    if(data.status==3){
                        layer.alert(data.msg,{title:false,closeBtn: 0,btn:false,time:1500});
                        $('#subshop').attr('href',"{:U('Shop/info')}");
                    }else if(data.status==1){
                        ischeck();
                    }else{
                        layer.alert(data.msg,{title:false,closeBtn: 0,btn:false,time:1500});
                    }
                },'json');
            });
        });

        function ischeck(){
            var boo=true;
            $(".size").each(function(index){
                var val=$(this).val();
                alert(val);
                if(val==""){
                    boo=false;
                    return false;
                }
            });
            if(boo){
                $.get("{:U('Shop/shoppost')}",function(){
                    $('form').submit();
                });
            }else{
                layer.alert('请选择尺寸',{title:false,closeBtn: 0,btn:false,time:1500});
            }
        }
    </script>
</body>
</html>